<template>
	<view class="changecity"> 
		<!-- 我是切换城市页面 -->
		<change-header></change-header>
		<change-list :city="city" @changeCity="changeCity"></change-list>
		<change-alphabet :city="city"></change-alphabet>
	</view>
</template>

<script>
	import t from '../../common/helper.js';
	import ChangeHeader from '../../components/ChangeHeader.vue';
 	import ChangeList from '../../components/ChangeList.vue';
	import ChangeAlphabet from '../../components/ChangeAlphabet.vue'
	
	export default {
		data() {
			return {
				city: [],
				event: '',
			}
		},
		components: {
			ChangeHeader,
			ChangeList,
			ChangeAlphabet,
		},
		methods: {
			getCityInfo () {
				uni.request({
					url: t.o+'/json/city.json',
					success: (res) => {
						this.city = res.data.city;
					}
				})
			},
			changeCity() {
				this.event.emit('changeCity');
			}
		},
		mounted() {
			this.getCityInfo();
		},
		onLoad() {
			this.event = this.getOpenerEventChannel();
		}
	}
</script>

<style lang="scss">
	.changecity {
		width: 100%;
		height: 100%;
	}
</style>
